<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>豆瓣电影评分250</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="../static/css/index.css">
</head>

<body>

<!-- 整个网页 -->
<div id="web_all">

    <!--header start--><header>
    <div id="header_div">
        <table id="header_table" cellpadding="10">
            <tr>

                <td>
                    <div class="logo" ><!-- 这是主logo -->
                        <img id="logo_main" src="../static/img/douban.png">
                    </div> 
                </td>
        
                <td>
                    <div class="word"><!-- 主网页标题 -->
                        <p class="word" id="title">豆&nbsp;瓣&nbsp;TOP250&nbsp;电&nbsp;影&nbsp;数&nbsp;据</p>
                    </div>
                </td>

                <td><!-- 菜单 -->
                    <p class="menus" id="movie_list_main">
                        <a class="menus_link" href="{{ url }}/movie_list">电影列表</a>
                    </p>
                </td>
                <td>
                    <p class="menus" id="diagram_main">
                        <a class="menus_link" href="{{ url }}/diagram">图表统计</a>
                    </p>
                </td>
                <td>
                    <p class="menus" id="wordCloud_main">
                        <a class="menus_link" href="{{ url }}/wordCloud">词云</a>
                    </p>
                </td>
                <td>
                    <p class="menus" id="team_main">
                        <a class="menus_link" href="{{ url }}/team">团队</a>
                    </p>
                </td>

            </tr>
        </table>

    </div>

    </header><!-- header end -->

    <hr/>

    <!-- 主体部分 -->
    <!-- main start --><main>
        <div id="main_div">

            <table id="main_table" border="0" cellpadding="3" cellspacing="0" align="center">

                <tr>
                    <td class="main_td">
                        <a class="menus_link" href="{{ url }}/movie_list">
                            <div class="logo" ><!-- 电影列表logo -->
                                <img id="logo_movie_list" src="../static/img/movie_list.png">
                                <h3>电影列表</h3>
                            </div> 
                        </a>
                    </td>

                    <td class="main_td">
                       <a class="menus_link" href="{{ url }}/diagram">
                            <div class="logo" ><!-- 图表统计logo -->
                                <img id="logo_diagram" src="../static/img/diagram.png">
                                <h3>图表统计</h3>
                            </div> 
                        </a>
                    </td>

                    <td class="main_td">
                        <a class="menus_link" href="{{ url }}/wordCloud">
                            <div class="logo" ><!-- 词云logo -->
                                <img id="logo_wordCloud" src="../static/img/wordCloud.png">
                                <h3>词云</h3>
                            </div> 
                        </a>
                    </td>

                    <td class="main_td">
                        <a class="menus_link" href="{{ url }}/team">
                            <div class="logo" ><!-- 团队logo -->
                                <img id="logo_team" src="../static/img/team.png">
                                <h3>团队</h3>
                            </div> 
                        </a>  
                    </td>
                </tr>

            </table>

        </div>


    </main><!-- main end -->

    <hr/>

    <!-- main footer --><footer>

        <table id="footer_table" align="center" cellpadding="0">
            
            <tr>
                <td class="footer_td">
                    <p id="footer_p1" class="footer_p">@</p>
                </td>
                <td class="footer_td">
                    <p id="footer_p2" class="footer_p">版</p>
                </td>
                <td class="footer_td">
                    <p id="footer_p3" class="footer_p">权</p>
                </td>
                <td class="footer_td">
                    <p id="footer_p4" class="footer_p">归</p>
                </td>
                <td class="footer_td">
                    <p id="footer_p5" class="footer_p">源</p>
                </td>
                <td class="footer_td">
                    <p id="footer_p6" class="footer_p">哥</p>
                </td>
                <td class="footer_td">
                    <p id="footer_p7" class="footer_p">所</p>
                </td>
                <td class="footer_td">
                    <p id="footer_p8" class="footer_p">有</p>
                </td>
            </tr>

        </table>

    </footer><!-- footer end -->

</div>

</body>
</html>